﻿<div>
    <Button Type="primary" OnClick="()=> _visible1 = true ">
        Display a modal dialog at 20px to Top
    </Button>
    <Modal Title="@("20px to Top")"
           Style="top: 20px"
           @bind-Visible="_visible1">
        <p>some contents...</p>
        <p>some contents...</p>
        <p>some contents...</p>
    </Modal>
    <br />
    <br />
    <Button Type="primary" OnClick="()=> _visible2 = true">
        Vertically centered modal dialog
    </Button>
    <Modal Title="@("Vertically centered modal dialog")"
           Centered="true"
           @bind-Visible="_visible2">
        <p>some contents...</p>
        <p>some contents...</p>
        <p>some contents...</p>
    </Modal>
</div>
@code {
    string title = "BasicModal";
    bool _visible1 = false;
    bool _visible2 = false;
}
